<template>
	<view class="container bar">
		<cu-custom bgColor="bg-white" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">{{data.title}}</block>
		</cu-custom>
		<view class="speciallist">
			<view class="text-empty text-center" v-if="data.specials.length==0">
				<text>空空如也</text>
			</view>
			<view class="specials padding-sm" v-else>
				<view class="cu-card article bg-white">
					<view class="cu-item" @click="BindTap(item.id)" v-for="(item, index) in data.specials" :key="index">
						<view class="content">
							<image class="cover" :src="item.imgUrl" mode="aspectFill"></image>
							<view class="desc">
								<view class="title">{{item.title}}</view>
								<view class="text-content text-warp">{{item.subtitle}}</view>
								<view class="justify-between flex">
									<view class="text-lg text-boldm">
										<text :class="item.price>0?'text-red':'text-green'">{{item.price>0?'￥'+item.price:'免费'}}</text>
										<text class="text-gray text-sm margin-left-sm margin-right-sm">|</text>
										<text :class="'text-'+(item.status==1?'green':'gray')">{{item.status==1?'上架':'下架'}}</text>
									</view>
									<view class="text-xxl" :class="showmenu==item.id?'text-red':''"><text class="cuIcon-more"></text></view>
								</view>
								<view class="cu-list menu padding-xs bg-white" :class="showmenu==item.id?'active':''">
									<view class="cu-item" @click="naviTo('special/detail',{id:item.id})">
										<view class="content">
											<text class="cuIcon-attention text-yellow"></text>
											<text>预览</text>
										</view>
									</view>
									<view class="cu-item" @click="naviTo('special/post',{id:item.id})">
										<view class="content">
											<text class="cuIcon-edit text-blue"></text>
											<text>编辑</text>
										</view>
									</view>
									<view class="cu-item" @click="RmSpecial(item.id,index)">
										<view class="content">
											<text class="cuIcon-delete text-red"></text>
											<text>删除</text>
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="cu-bar tabbar">
			<view class="action">
				<button @click="naviTo('special/post')" class="cu-btn lg round margin-bottom-xl bg-orange-red shadow">创建新专栏</button>
			</view>
		</view>
	</view>
</template>

<script>
	import {mapState} from 'vuex'
	import core from "@/static/core.js"
	
	export default {
		computed: mapState(['hasLogin', 'lectorid']),
		data() {
			return {
				showmenu:0,
				data:{
					title:"专栏管理",
					specials:[]
				}
			}
		},
		onLoad() {
			
		},
		onShow() {
			if(!this.hasLogin) return core.toast('请先登录','login');
			if(!this.lectorid) return core.navito('lector/apply',{},1);
			
			this.initData('lector/special');
		},
		onPullDownRefresh() {
			this.initData('lector/special');
			uni.stopPullDownRefresh();
		},
		methods:{
			async initData(route, data={}, callback=false){
				var that = this;
			// 	core.get(route,function(res){
			// 		if(typeof(res.message)!='undefined' && typeof(res.type)!='undefined'){
			// 			return core.report(res, true);
			// 		}
			// 		that.data = res;
			// 		uni.setNavigationBarTitle({
			// 			title:res.title
			// 		});
			// 		if(callback){
			// 			callback(res);
			// 		}
			// 	},data);
			this.data.specials = (await this.$api.reqGet({
				url:"column/selall/"+core.userinfo.uid
			})).data;
			console.log(this.data.specials)
			if(this.data.specials==null){
				this.data.specials=[];
				core.toast("您目前没有专栏请,尽快添加!!!!,谢谢配合")
			}
			},
			naviTo(page,data={}){
				return core.navito(page,data);
			},
			unSupport(){
				return core.toast('敬请期待');
			},
			BindTap(id){
				if(this.showmenu==id){
					this.showmenu = 0;
				}else{
					this.showmenu = id;
				}
			},
			async RmSpecial(sid){
				// if(!sid) return false;
				// var that = this;
				// return core.confirm('删除后不可恢复，是否确定要删除？','删除专栏',function(){
				// 	core.get('special/remove',function(res){
				// 		if(res.type!='success') return core.report(res);
				// 		core.toast(res.message,'','success');
				// 		that.data.specials.splice(index,1);
				// 	},{id:sid});
				// });
				var a =(await this.$api.reqGet({
				url:"column/del/"+sid
			})).data;
			this.data.specials = (await this.$api.reqGet({
				url:"column/selall/"+core.userinfo.uid
			})).data;
			}
		}
	}
</script>

<style>
	page{background: #FFFFFF;}
	.specials{padding-bottom: 100upx;}
	.specials .cu-card{overflow: visible;}
	.specials .cu-item .desc{position: relative;}
	.desc .cu-list{display: none; position: absolute; box-shadow:0px 4px 22px 0px rgba(0,0,0,0.14); width: 172upx; right: -14upx; top: 172upx; overflow: visible; z-index: 888;}
	.desc .cu-list::before{content: ''; width: 20upx; height: 20upx; background: #FFFFFF; position: absolute; top: -8upx; right: 20upx; transform: rotate(45deg);}
	.desc .cu-list.active{display: block;}
	.desc .cu-list .cu-item{padding: 0; min-height: 64upx; margin-left: 0; box-shadow: none; margin-right: 0;}
	.desc .cu-list .cu-item .content{padding: 0; line-height: 64upx;}
</style>
